import styles from "./index.module.less";
import IMToolTip from "@/components/common/ToolTip";
export default defineComponent({
  name: "TipsCell",
  props: {
    content: {
      type: [String, Array, Object],
      required: false,
      default: "",
    },
    color: {
      type: [String, Object],
      required: false,
      default: "#ffffff",
    },
    placement: {
      type: [String, Object],
      required: false,
      default: "top",
    },
    trigger: {
      type: [String, Object],
      required: false,
      default: "hover",
    },
  },
  setup(props: any, { attrs, expose, slots, emit }) {
    return () => (
      <im-tooltip
        className=""
        placement={props.placement?.value ?? props.placement}
        color={props.color?.value ?? props.color}
        trigger={props.trigger?.value ?? props.trigger}
        title={
          <div class={styles.tips_cell}>
            <div class={styles.icon}>
              {renderIcon("icon-jinggao-" + " " + styles["icon-jinggao-"])}
            </div>
            <div class={styles.text}>
              {(props.content?.value ?? props.content)?.map?.((text: any) => (
                <div>{text?.value ?? text}</div>
              )) ??
                props.content?.value ??
                props.content}
            </div>
          </div>
        }
        defaultValue={renderIcon("icon-tishi5")}
      />
    );
  },
});
